<template>
  <div>
    <div v-for="item,index in tableList" :key="index">
      <personTableUpload :name="item.name" :url="item.url" :imgUrl="item.imgUrl" />
    </div>
  </div>
</template>

<script>
  import {
    upload_meta_from_excel
  } from '@/api/person.js'
  import personTableUpload from './components/personTableUpload.vue'
  export default {
    components: {personTableUpload},
    data() {
      return {
        messageErr: '',
        messageSuccess: '',
        tableList: [
          {
            name: 'person-idCard',
            url: 'upload_person_and_idcard_from_excel',
            imgUrl: require('@/assets/img/personandidcard.png')
          },
          {
            name: 'employee',
            url: 'upload_employee_from_excel',
            imgUrl: require('@/assets/img/employee.png')
          },
          {
            name: 'coach',
            url: 'upload_coach_from_excel',
            imgUrl: require('@/assets/img/coach.png')
          },
          {
            name: 'player',
            url: 'upload_player_from_excel',
            imgUrl: require('@/assets/img/player.png')
          },
          {
            name: 'player_coach_map',
            url: 'upload_player_coach_map_from_excel',
            imgUrl: require('@/assets/img/player_coach_map.png')
          },
        ],
      }
    },
    methods: {
      sequenceDownload(row) {
        const element = document.createElement('a')
        element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(row.data))
        element.setAttribute('download', row.name+'上传成功.txt')
        element.style.display = 'none'
        element.click()
      },
      beforeRemove(file) {
        this.messageErr = this.messageSuccess = ''
      },
      beforeUpload(file) {
        var testmsg = file.name.substring(file.name.lastIndexOf('.') + 1)
        const extension2 = testmsg === 'xlsx'
        const isLt2M = file.size / 1024 / 1024 < 10
        if (!extension2) {
          this.messageErr = '上传文件只能是 xlsx格式!'
          return
        }
        if (file.size > 1024 * 1024 * 10) {
          this.messageErr = '上传文件太大!不能超过10M'
          return
        }
        let fileData = new FormData()
        fileData.append("file", file.raw);
        upload_meta_from_excel(fileData).then(res => {
          if (res.code === 200) {
            this.messageSuccess = '上传成功! ' + res.message
            this.sequenceDownload({name:file.name.split('.')[0],data:res.message.split('<br>').join('\n')})
          } else {
            this.messageErr = res.message
          }
        })
      },
    }
  }
</script>

<style lang="scss" scoped>
  .upload {
    padding: 20px;
    position: relative;

    .upload-demo {
      display: flex;
      justify-content: space-between;
    }

    .error-msg {
      position: absolute;
      top: 20px;
      left: 200px;
      width: 60%;
      min-height: 200px;
      border: 1px solid #d8d8d8;
      background-color: #FFFFFF;
      border-radius: 4px;
    }
  }
</style>
